import { defineComponent } from 'vue';
import { SearchOutlined } from '@ant-design/icons-vue';
import SampleComponentBase from '/@/shared/component-base/sample-component-base';
import { IButtonGroupsDto, ButtonConfigs } from '/@/shared/service-proxies';
export default defineComponent({
  props: {
    json: {
      type: Object,
      required: true,
      default: {} as IButtonGroupsDto,
    },
  },
  data() {
    return {};
  },
  emits: ['action-click', 'GetRefitems'],
  components: { SearchOutlined },
  mixins: [SampleComponentBase],
  mounted() {
    /**将Ref逐个抛出 */
    this.buttonConfigs.forEach((e: ButtonConfigs) => {
      const items = this.GetRefitem(e.eventName);
      this.$emit('GetRefitems', items);
    });
  },
  computed: {
    buttonConfigs() {
      return this.json.buttonConfigs;
    },
    /**
     * 左侧按钮
     * 权限
     */
    leftList(): ButtonConfigs[] {
      const arr = this.buttonConfigs.filter((item: ButtonConfigs) => {
        return item.position == 'left' && (!!item.acl ? this.isGranted(item.acl) : true);
      });
      return arr.sort((a: ButtonConfigs, b: ButtonConfigs) => {
        return (a?.sortNum ?? 0) - (b?.sortNum ?? 0);
      });
    },
    /** 类型是否为导入 */
    hasImportType() {
      return (item: ButtonConfigs) => {
        const arr: Array<string> = ['Import'];
        return arr.includes(!!item.eventName ? item.eventName : '');
      };
    },
    /**
     * 右侧按钮
     * 权限
     */
    rightList(): ButtonConfigs[] {
      const arr = this.buttonConfigs.filter((item: ButtonConfigs) => {
        return item.position == 'right' && (!!item.acl ? this.isGranted(item.acl) : true);
      });
      return arr.sort((a: ButtonConfigs, b: ButtonConfigs) => {
        return (a?.sortNum ?? 0) - (b?.sortNum ?? 0);
      });
    },
    /**获取按钮组的所有Ref */
    GetRefitem(): {} {
      return (value) => {
        return { Name: value, Instance: this.$refs[value] };
      };
    },
    formatClass() {
      return (className) => {
        if (className == 'primary') return '';
        return className;
      };
    },
  },
  methods: {
    /**
     * toolbar 按钮点击事件
     */
    handleToobarBtnClick(type: string | undefined, value = undefined) {
      this.$emit('action-click', type, value);
    },
    /** 监听滚动 */
    handleLeftScroll(event) {
      let eventDelta = -event.wheelDelta || -event.deltaY * 20;
      let scrollDiv = this.$refs.left as any;
      scrollDiv.scrollLeft = scrollDiv.scrollLeft + eventDelta / 2;
    },
    /** 监听滚动 */
    handleRightScroll(event) {
      let eventDelta = -event.wheelDelta || -event.deltaY * 20;
      let scrollDiv = this.$refs.right as any;
      scrollDiv.scrollLeft = scrollDiv.scrollLeft + eventDelta / 2;
    },
  },
});
